<template>
<!-- 上传页面1 -->
    <div class="upload-container">
        <div class="upload-box">
            <div class="header">
                <van-icon name="arrow-left" size="11vw" @click="$router.go(-1)"/>
                <div>分享今日份甜甜碎片吧！</div>

            </div>
            <div class="main">
                <div class="up1">
                    <img src="../assets/upload2.webp" alt="">
                    <span>分享食谱</span>
                </div>
                <div class="up2" @click="$router.push('/sharelife')">
                    <img src="../assets/upload3.webp" alt="" >
                    <span>分享生活</span>
                </div>
            </div>
            
        </div>
        

    </div>
</template>

<script>
    export default {
        
        
    }
</script>

<style lang="scss" scoped>
.upload-container{
    // 设置背景图片
    background-image: url("../assets/upload1.webp");
     /* div充满全屏 */
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    /* 背景图调整大小: cover */
    background-size: cover;
    opacity: 0.6;
}
.upload-box{
    widows: 100%;
    height: 100%;
    //border: 1px solid red;
    .header{
        div{
            //border: 1px solid red;
            height: 8vh;
            margin: 1.5vh auto;
            //text-align: center;
            font-size: 8vw;
            position: absolute;
            left: 9vw;
        }
    }
    .main{
        width:100%;
        height: 35vh;
        //border: 1px solid red;
        position: absolute;
        top: 45%;
        display: flex;
        justify-content: space-evenly;
        >div{
            width:40vw;
            //border: 1px solid red;
            display: flex;
            flex-direction: column;
            img{
                width: 100%;
                height: 40vw;
                border: 1px solid rgb(255, 196, 0);
                border-radius: 50%;
            }
            span{
                width: 100%;
                height: 18vw;
                //border: 1px solid rgb(255, 196, 0);
                text-align: center;
                margin-top: 3vh;
                font-size: 5.5vw;
                font-weight:bolder;
            }
        }
        

    }
    
}
</style>